<html><head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<link href="src/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="src/prettify.js"></script>
<script type="text/javascript" src="https://raw.github.com/douglascrockford/JSON-js/master/json2.js"></script>
	
</head>
<body>
<script type='text/javascript'>
String.prototype.c = function(index) {
var v = this.charAt(index);
if(v == '') return undefined;
return v;     
}
String.prototype.trim = function(){
return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}


function formatText (el,tag) {
if (el.setSelectionRange) {	
	var tagstart = tag;
	var tagend = tag;
	var val = el.value.substring(el.selectionStart,el.selectionEnd);
	
	if(val.trim().length){
	if(tag == 'code') 
	{
		var x = val;
		if(x.substring(0,4) == '    ')
		{
		
		  x = x.replace(/\n {4}/g,'\n').substr(4);
		}
		else
		{
		
		x = '    '+ x.replace(/\n/g, '\n    ');
		}
		el.value = el.value.substring(0,el.selectionStart) + x + el.value.substring(el.selectionEnd,el.value.length);
	}
	else
 		el.value = el.value.substring(0,el.selectionStart) + tagstart + val.trim() + tagend + el.value.substring(el.selectionEnd,el.value.length);
		}
  	}
  	else{	
        var val = document.selection.createRange().text;  		
        if(val.trim().length) {
		if(tag == 'code')
		{
		var x = val;
		if(x.substring(0,4) == '    ')
		{		
		  x = x.replace(/\n {4}/g,'\n').substr(4);
		}
		else
		{		
			x = '    '+ x.replace(/\n/g, '\n    ');
		}
		document.selection.createRange().text = x;
		}
		else{
		
		var newText = tag + val + tag; 
        document.selection.createRange().text = newText; 
		}
	}   
	}
$('#b1').click();	
} 
	
$(function(){  
$('textarea').keydown(function(e){
insertTab(this,e);
//$('#b1').click();
}).keyup(function(){$('#b1').click();});

$('#b1').click(function(){
var roa = [];  
  x = $('textarea').val();
  
  for(var o=0; o<=x.length; o++)
  {    
    if(isc(o,x))
    {
      var ec = getec(o,x);      
      roa.push({w:o, v: '<pre class="prettyprint" >'+htmlEscape(x.substring(o, ec+1))+'</pre>', t: 'c'});
      x = replaceFromTo(x,o,ec,' ');
    }    
  }  
  
  for (var i=0;i<=x.length;i++)
  {
    if(isb(i,x,'*')) {
    var j = geteb(i,x,'*');
      if(j == -1) break;
        roa.push({ w:i, v:'<b>'});
        roa.push({w:j, v:'</b>'});
      i = j;
    } 
  }
  
  for (var y=0;y<=x.length;y++)
  {
    if(isb(y,x,'_')) {
    var b = geteb(y,x,'_');
      if(b == -1) break;
        roa.push({ w:y, v:'<i>'});
        roa.push({w:b, v:'</i>'});  
      y = b;
    } 
  }

  roa = roa.sort(function(a,b) { return a.w - b.w; } );
  
  var dz = [];
  
      var oo = 0;
  for(var a in roa){
    x = replaceAt(x, roa[a].w+oo, roa[a].v);
    if(roa[a].t == 'c') 
      dz.push({ x1:roa[a].w+oo, x2:roa[a].v.length+roa[a].w+oo});
    
    oo += (roa[a].v.length-1);
  }

  x = sr(x,dz,0,0,x);
  x = smartEncode(x);
  $('#l').html(x.length + JSON.stringify(roa).replace(/</g, '&lt;')
     .replace(/>/g, '&gt;'));
    
$('#r').html(x);
prettyPrint();
});

});

function sr(x,dz,lx2,i,ox){  
if(dz[i] === undefined) return repl(x); 
  
return repl(ox.substring(lx2,dz[i].x1))+ 
  ox.substring(dz[i].x1,dz[i].x2+1)+  
  sr(ox.substr(dz[i].x2+1),dz,dz[i].x2,i+1,ox);  
}

function repl(x)
{
  return x.replace(/\n/g, '<br/>')
     .replace(/ /g, '&nbsp;');
}

  
function isc(o,x){
  if(x.c(o)==x.c(o+1)==x.c(o+2)==x.c(o+3)&& x.c(o)== ' ' && (x.c(o-1) == '\n'||x.c(o-1) === undefined))
    return true;
    return false;
  }
  
  function getec(o,x)
  {
    for(var i = o+4; i<=x.length; i++){
      if(x.c(i) == '\n'){      
      if(isc(i+1,x)|| x.c(i+1) == '\n') continue;
        return i-1;
      }
    }
    return x.length-1;
  }
  
function isb(i,s,c){
    var d = c == '*'? '_' : '*';
  if(s.c(i) != c) return false;
  if(notin(s.c(i-1),[' ','\n',d]) && i !== 0) return false;
    return (notin(s.c(i+1),[' ','\n']));
}

function geteb(i,s,c)
{  
  var d = c == '*'? '_' : '*';

for(var j = i+2; j<=s.length; j++){
  if(s.c(j) === undefined) continue;
  if(notin(s.c(j+1),[' ','\n',d]) && j != s.length-1) continue;
  if(s.c(j) == c && notin(s.c(j-1),[' ','\n'])) return j;
}
 return -1; 
}

function replaceAt(s,i,n)
{
  var s1 = s.substring(0,i);
  var s2 = s.substring(i+1); 
  return s1+n+s2;      
}
    
function replaceFromTo(s,f,t,n)
{
  var s1 = s.substring(0,f);
  var s2 = s.substring(t+1); 
  return s1+n+s2;      
}

function notin(c,arr)
{
  for(var i in arr){
  if(arr[i] == c) return false;
  }
  return true;
}

function htmlEscape(str) {
    return String(str)
            .replace(/&/g, '&amp;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#39;')			
            .replace(/</g, '&lt;')            			
            .replace(/>/g, '&gt;')
            .replace(/ /g, '&nbsp;')
			.replace(/\n/g, '<br\>');
}

function insertTab(o, e)
{			
	var kC = e.keyCode ? e.keyCode : e.charCode ? e.charCode : e.which;
	if (kC == 9 && !e.shiftKey && !e.ctrlKey && !e.altKey)
	{
		var oS = o.scrollTop;
		if (o.setSelectionRange)
		{
			var sS = o.selectionStart;
			var sE = o.selectionEnd;
			o.value = o.value.substring(0, sS) + "    " + o.value.substr(sE);
			o.setSelectionRange(sS + 4, sS + 4);
			o.focus();
		}
		else if (o.createTextRange)
		{
			document.selection.createRange().text = "    ";
			e.returnValue = false;
		}
		o.scrollTop = oS;
		if (e.preventDefault)
		{
			e.preventDefault();
		}
		return false;
	}
	return true;
}

function shasv(s){
if(s === null || s === undefined) return false;
  return true;
}

function ist(x,i,t){
  if(x.c(i) != '<') return false;
  var c = '';
  if(x.c(i+1) == '/') c = '/';
  
  for(var j in t){
    var n = x.substr(i+1+t[j].length+c.length,1);    
    if(x.substr(i+1,t[j].length+c.length) == c+t[j] && (n == '>' || n == '/' || n == ' ' )) return true;
  }
  return false;   
}

function smartEncode(x){
	for(var i =0 ; i<=x.length;i++){
		if(x[i] == '<' && !ist(x,i,['p','b','i','u','hr','br','pre','ul','li','ol']))
		x = replaceAt(x,i,'&lt;');
	}
	return x;
}


</script>


 <textarea cols='50' rows='20' id='text1'>
 </textarea>
 <button id='b1'>make code</button>
  <input type="button" value="b" onclick="formatText(document.getElementById('text1'),'*');" />
  <input type="button" value="i" onclick="formatText(document.getElementById('text1'),'_');" />
  <input type="button" value="code" onclick="formatText(document.getElementById('text1'),'code');" />
 <div style='border:1px solid green;' id='r'>
 </div>
  <div id='l'></div> 
 <pre class="prettyprint" id='tt'>
</pre>

</body>
</html>